<template>
  <div class="section">
    <div class="container">
      <!--Title-->
      <div class="section-title has-text-centered">
        <h2 class="title is-2">Remove paperwork</h2>
        <h4>Ampersand makes things frictionless</h4>
      </div>

      <!-- Feature -->
      <div class="columns is-vcentered side-feature">
        <div class="column is-6 has-text-centered">
          <img
            class="light-image-l featured-image"
            src="/@src/assets/illustrations/landing/vault.svg"
            alt=""
          />
          <img
            class="dark-image-l featured-image"
            src="/@src/assets/illustrations/landing/vault.svg"
            alt=""
          />
        </div>
        <div class="column is-5">
          <h2 class="title m-b-10 is-centered-tablet-portrait">Audited</h2>
          <p class="section-feature-description is-centered-tablet-portrait">
            Diplamo is a secure solution. Its inner workings have been audited
            by blockchain professionals. The certificate logic is stored in the
            blockchain.
          </p>
        </div>
      </div>
      <!-- Feature -->
      <div class="columns is-vcentered side-feature">
        <div
          class="
            column
            is-6
            has-text-centered
            h-hidden-desktop h-hidden-tablet-p h-hidden-tablet-l
          "
        >
          <img
            class="light-image-l featured-image"
            src="/@src/assets/illustrations/landing/wallet.svg"
            alt=""
          />
          <img
            class="dark-image-l featured-image"
            src="/@src/assets/illustrations/landing/wallet.svg"
            alt=""
          />
        </div>
        <div class="column is-5 is-offset-1">
          <h2 class="title m-b-10 is-centered-tablet-portrait">Money saver</h2>
          <p class="section-feature-description is-centered-tablet-portrait">
            Diplamo saves money to both students and institutions when compared
            with the traditional costs of issuing certificates. It leverages
            technology to make issuing certificates cheaper without disregarding
            security.
          </p>
        </div>
        <div class="column is-6 has-text-centered h-hidden-mobile">
          <img
            class="light-image-l featured-image"
            src="/@src/assets/illustrations/landing/wallet.svg"
            alt=""
          />
          <img
            class="dark-image-l featured-image"
            src="/@src/assets/illustrations/landing/wallet.svg"
            alt=""
          />
        </div>
      </div>
      <!-- Feature -->
      <div class="columns is-vcentered side-feature">
        <div class="column is-6 has-text-centered">
          <img
            class="light-image-l featured-image"
            src="/@src/assets/illustrations/landing/macbook.svg"
            alt=""
          />
          <img
            class="dark-image-l featured-image"
            src="/@src/assets/illustrations/landing/macbook.svg"
            alt=""
          />
        </div>
        <div class="column is-5">
          <h2 class="title m-b-10 is-centered-tablet-portrait">
            Modern solution
          </h2>
          <p class="section-feature-description is-centered-tablet-portrait">
            Diplamo uses blockchain technology, which by design is a public
            ledger. This means that all the logging requirements are taken care
            for you and your institution, allowing you reduce administrative
            complexity.
          </p>
        </div>
      </div>
    </div>
  </div>
</template>
